import { getPageTitle } from '@ant-design/pro-layout';
import DocumentTitle from 'react-document-title';
import { useEffect } from 'react';
import { connect } from 'dva';
import styles from './UserLayout.less';
import defaultSystemSettings from './defaultSystemSettings';

const UserLayout = props => {
  const { settings, children } = props;
  const { loginBackgroundImage } = defaultSystemSettings;
  useEffect(() => {
    document.title = '姬霓太美平台';
  });
  return (
    <DocumentTitle
      title={getPageTitle({
        ...settings,
      })}
    >
      <div className={styles.layoutContainer}>
        <div
          className={styles.content}
          style={{
            backgroundImage: `url(${loginBackgroundImage})`,
            backgroundPosition: 'center',
          }}
        >
          {children}
        </div>
      </div>
    </DocumentTitle>
  );
};

export default connect(({ settings }) => ({
  settings,
}))(UserLayout);
